<template>
  <div class="authority">
    <div class="left">
      <div class="talent">
       <span class="xuanz">选择角色：</span> <el-autocomplete
          popper-class="my-autocomplete"
          v-model="state"
          style="width:70%;"
          :fetch-suggestions="querySearch"
          placeholder="请输入内容"
          @select="handleSelect"
        >
          <i
            class="el-icon-arrow-down el-input__icon"
            slot="suffix"
            @click="handleIconClick"
          >
          </i>
          <template slot-scope="{ item }">
            <div class="name">{{ item.value }}</div>
            <span class="addr">{{ item.address }}</span>
          </template>
        </el-autocomplete>
      </div>

<!-- <trees>

</trees> -->


    </div>
    <div class="right">right</div>
  </div>
</template>
<script>
module.exports = {
  data() {
    return {
      restaurants: [],
      state: "",
    };
  },
  components:{
     'trees': httpVueLoader('../../laycomponets/tree/elCheckTreeSelect.vue')
  },
  mounted() {
    this.restaurants = this.loadAll();
    axios.get(this.$baseUrl + this.$apiList.caller,this.$paramters.ctrlmthdcaller('objectoperator','saveObject')).then(res=>{
       let { data } = res
       console.log(data)
    })
  },
  methods: {
    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return (restaurant) => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
        );
      };
    },
    loadAll() {
      return [
        { value: "三全鲜食（北新泾店）", address: "长宁区新渔路144号" },
        {
          value: "Hot honey 首尔炸鸡（仙霞路）",
          address: "上海市长宁区淞虹路661号",
        },
        {
          value: "新旺角茶餐厅",
          address: "上海市普陀区真北路988号创邑金沙谷6号楼113",
        },
        { value: "泷千家(天山西路店)", address: "天山西路438号" },
        {
          value: "胖仙女纸杯蛋糕（上海凌空店）",
          address: "上海市长宁区金钟路968号1幢18号楼一层商铺18-101",
        },
      ];
    },
    handleSelect(item) {
      console.log(item);
    },
    handleIconClick(ev) {
      console.log(ev);
    },
  },
};
</script>
<style scoped>
.authority {
  display: flex;
  height: 100%;
  box-sizing: border-box;
}
.xuanz {
   font-size: 16px;
   color: #333333;
   font-family: Microsoft YaHei Regular, Microsoft YaHei Regular-Regular;
   font-weight: 400;

}
.left {
   padding: 40px 30px;
  width: 40%;
  box-sizing: border-box;
}
.right {
  width: 100%;
  box-sizing: border-box;
}
</style>